<template>
  <div class="showDetail">
    <el-dialog :title="'订单详情'" :visible.sync="showDialog" @close="$emit('update:showDetailInfo', false)"
               :showDetailInfo="showDetailInfo">
      <el-form class="small-space" ref="adjustTypeFrom" label-position="right" label-width="120px">
        <dialog-wrapper :width="500">
          <el-form-item label="商户:">
            <p style="margin:0px">{{DetailInfo.mch_id}}</p>
          </el-form-item>
          <el-form-item label="用户ID:">
            <p style="margin:0px">{{DetailInfo.user_id}}</p>
          </el-form-item>
          <el-form-item label="订单号:">
            <p style="margin:0px">{{DetailInfo.id}}</p>
          </el-form-item>
          <el-form-item v-if="DetailInfo.handler !== 'auto'" label="处理人:">
            <p style="margin:0px">{{DetailInfo.handler}}</p>
          </el-form-item>
          <el-form-item v-if="DetailInfo.handler !== 'auto'" label="处理意见:">
            <p style="margin:0px">{{DetailInfo.msg}}</p>
          </el-form-item>
          <el-form-item label="JUSTPAY订单号:">
            <p style="margin:0px">{{DetailInfo.out_trade_no}}</p>
          </el-form-item>
          <el-form-item label="订单金额:">
            <p style="margin:0px">{{DetailInfo.total_fee}}</p>
          </el-form-item>
          <el-form-item label="真实金额:">
            <p style="margin:0px">{{DetailInfo.real_amount}}</p>
          </el-form-item>
          <el-form-item label="订单创建时间:">
            <p style="margin:0px">{{DetailInfo.created_at}}</p>
          </el-form-item>
          <el-form-item label="通知状态:">
            <p style="margin:0px">{{ NotifyStatusArray[DetailInfo.notify_status] }}</p>
          </el-form-item>
        </dialog-wrapper>
      </el-form>
    </el-dialog>
  </div>
</template>

<script>
  import DialogWrapper from '@/components/DialogWrapper'
  import { getOrderDetail } from '@/api/merchant'
  export default {
    components: { DialogWrapper },
    data() {
      return {
        DetailInfo: {},
        showDialog: this.showDetailInfo,
        NotifyStatusArray: ['未回调', '回调失败', '回调成功']
      }
    },
    props: {
      showDetailInfo: {
        type: Boolean,
        default: false
      },
      order_id: {
        type: Number
      }
    },
    created(){
      if(this.order_id){
        this.getRechargeDetail()
      }
    },
    methods: {
      getRechargeDetail(){
        getOrderDetail(this.order_id).then(res => {
          if(res.status === 0) {
            this.DetailInfo = res.data
          }
        })
      }
    },
    watch: {
      showDetailInfo() {
        this.showDialog = this.showDetailInfo
      }
    }
  }
</script>
